<template>
  <div id="FlagItem">
    <span v-for="item in answer" :key="item.id"
      >{{ item.index + 1 }}: {{ item.name }}</span
    >
  </div>
</template>
  
  <script>
export default {
  name: "FlagItem",
  data() {
    return {
      answer: [],
    };
  },
  props: {
    answers: {
      answers: Array,
    },
  },

  watch: {
    answers: {
      deep: true,
      immediate: true,
      handler() {
        this.answer = this.answers;
      },
    },
  },
};
</script>
  
  <style scoped>
.right {
  color: green;
}
.error {
  color: red;
}
.undo {
  color: #ccc;
}
</style>